<template>
	<view id="main">
		<view class="headerimg">
			<image :src="workarea" mode="widthFix"></image>
		</view>

		<view class="work" id="workstate" :class="topindex>=headerheight?'suspended-top':''">
			<view class="initiate" @tap="started" hover-class="com-hover-icon">
				<view class="initiatecount">
					<text class="iconfont icon-ym-wofaqide"></text>
				</view>
				<view class="color-3A3A3A">新增企业</view>
			</view>
			<view class="initiate" @tap="backlog" hover-class="com-hover-icon">
				<view class="initiatecount">
					<text class="iconfont icon-ym-daibanshixiang"></text>
				</view>
				<view class="color-3A3A3A">发布需求</view>
			</view>
			<view class="initiate" @tap="alreadybacklog" hover-class="com-hover-icon">
				<view class="initiatecount">
					<text class="iconfont icon-ym-yibanshixiang"></text>
				</view>
				<view class="color-3A3A3A">我的关注</view>
			</view>
			<view class="initiate" @tap="copyme" hover-class="com-hover-icon">
				<view class="initiatecount">
					<text class="iconfont icon-ym-chaosongwode"></text>
				</view>
				<view class="color-3A3A3A">我要推广</view>
			</view>
		</view>
		<view class="head">
			<view class="head-item" v-for="(item,index) in headItems" :key="index" hover-class="com-hover-btn"
				@tap="deRoute(item)">
				<view class="uni-grid-9-ico">
					<label class="iconfont icon-label-lin" :class="item.F_Icon"></label>
				</view>
				<text class="uni-grid-9-text">{{item.F_FullName}}</text>
			</view>
		</view>

		<view class="uni-grid-9">
			<view class="uni-grid-9-item" v-for="(item,index) in items" :key="index" hover-class="com-hover-icon"
				@tap="deRoute(item)">
				<view class="uni-grid-9-ico">
					<label class="iconfont icon-label-lin" :class="item.F_Icon"></label>
				</view>
				<text class="uni-grid-9-text">{{item.F_FullName}}</text>
			</view>
			<view class="uni-grid-9-item last-item" v-if="number===2"></view>
		</view>
		<view class="noContent" v-if="isData" style="padding-top: 150rpx;">
			<img :src="nodata" alt="">
			<view class="">
				暂无数据
			</view>
		</view>
	</view>
</template>

<script>
	import jnpf from '@/common/js/jnpf.js'
	import helper from '@/common/js/helper.js'
	import config from '@/common/js/config.js'
	export default {
		data() {
			return {
				flowdata: [],
				topindex: '',
				headerheight: 135,
				workheight: '',
				flowEngines: [],
				startedrow: 0,
				backlogrow: 0,
				alreadybacklogrow: 0,
				copymerow: 0,
				workarea: config.Resources.banner.workarea,
				timeStamp: 0,
				nodata: config.Resources.message.nodata,
				isData: false,
				headItems: [],
				items: [],
				number: 0
			}
		},
		computed: {
			suspendedTop() {
				return this.workheight
			}
		},
		onLoad() {
			uni.showLoading({ //loading提示框
				title: '加载中...',
				mask: true
			});
			let _slfe = this;
			setTimeout(function() {
				try {
					const applyMenu = uni.getStorageSync(config.Global.cache + '_ApplyMenu');
					if (applyMenu == '') {
						_slfe.isData = true
						return;
					}
					_slfe.isData = false
					let newApplyMenu = []
					for (var i = 0; i < applyMenu.length; i++) {
						if (i < 2) {
							_slfe.headItems.push({
								F_Id: applyMenu[i].id,
								F_Icon: applyMenu[i].icon,
								F_FullName: applyMenu[i].fullName,
								F_UrlAddress: applyMenu[i].urlAddress
							});
						} else {
							_slfe.items.push({
								F_Id: applyMenu[i].id,
								F_Icon: applyMenu[i].icon,
								F_FullName: applyMenu[i].fullName,
								F_UrlAddress: applyMenu[i].urlAddress
							});
						}
					}
					_slfe.number = _slfe.items.length % 3
				} catch (e) {}
			}, 200);
			uni.hideLoading();
		},
		onPageScroll(e) {
			this.topindex = e.scrollTop;
		},
		mounted() {
			let _this = this;
			let work = uni.createSelectorQuery().select(".work");
			work.boundingClientRect(data => {
				_this.workheight = data.height;
			}).exec();
		},
		methods: {
			started() {
				uni.navigateTo({
					url: '/pagesJiushi/customer/customer',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			backlog() {
				uni.navigateTo({
					url: '../operate/backlog/backlog',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			alreadybacklog() {
				uni.navigateTo({
					url: '../operate/alreadybacklog/alreadybacklog',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			copyme() {
				uni.navigateTo({
					url: '../operate/copyme/copyme',
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			},
			flowform(e, event) {

				uni.setStorageSync('F_FullName', e.F_FullName)
				uni.setStorageSync("F_Category", e.F_Category)

				// #ifdef MP
				if (this.timeStamp == 0) {
					this.timeStamp = event.timeStamp;
				} else {
					if (event.timeStamp - this.timeStamp < 800) {
						return;
					}
					this.timeStamp = event.timeStamp;
				}
				// #endif
				// #ifndef MP
				if (this.timeStamp == 0) {
					this.timeStamp = event.mp.timeStamp;
				} else {
					if (event.mp.timeStamp - this.timeStamp < 800) {
						return;
					}
					this.timeStamp = event.mp.timeStamp;
				}
				// #endif
				let flowname = e.F_EnCode.toLowerCase();
				let flowInfo = {
					operstate: 'add',
					id: e.F_Id,
					initId: e.F_Id,
					status: 0
				}
				let url = '/pages/work/flowchart/' + flowname + '/' + 'form?flowInfo=' + JSON.stringify(flowInfo);
				if (e.F_FormType == 2) {
					url = '/pages/work/flowchart/dynamic/form?flowInfo=' + JSON.stringify(flowInfo)
				}
				uni.navigateTo({
					url: url,
					success: res => {

					},
					fail: (err) => {
						helper.msg("暂无此页面")
					}

				});
			},
			/* 点击跳转 */
			deRoute(e) {
				uni.setStorage({
					key: "title",
					data: e
				})
				// uni.showLoading({
				// 	title:'正在处理',
				// 	mask:true,
				// })
				setTimeout(function() {
					uni.navigateTo({
						url: e.F_UrlAddress,
						success: function(res) {

						},
						fail: (err) => {
							helper.msg("暂无此页面")
						}

					})
					uni.hideLoading();
					/* 清除汇报页缓存 */
					uni.removeStorageSync('TabCur3')
				}, 300);

			},
		}
	}
</script>

<style>
	page {
		background-color: #f0f2f6;
	}

	.headerimg {
		width: 100%;
		height: 380upx;
	}

	.headerimg image {
		width: 100%;
		height: 100%;
	}

	.work {
		width: 95%;
		margin: 0 auto;
		border-radius: 20rpx;
		overflow: hidden;
		height: 190upx;
		align-content: center;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		margin-top: -80rpx;
	}

	.common::after {
		content: "";
		position: absolute;
		z-index: 10;
		right: 0;
		bottom: 0;
		left: 0rpx;
		height: 1px;
		-webkit-transform: scaleY(.5);
		transform: scaleY(.5);
		background-color: #c8c7cc;
	}

	.iconlabel {
		position: absolute;
		left: 55%;
		top: 10%;
	}

	.common text {
		vertical-align: middle;
		font-size: 36upx;
		font-weight: 500;
		color: #3a3a3a;
	}

	.box-title {
		vertical-align: middle;
		font-size: 19px;
		font-weight: 500;
		color: #000000;
		border-bottom: 1px solid #DBDBDB;
	}

	.initiate {
		text-align: center;
		width: 25%;
		height: 100%;
		background-color: #fff;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		position: relative;

	}

	.initiatecount {
		font-size: 42upx;
		font-family: 微软雅黑;
		font-weight: bold;
		color: #3A3A3A;
		line-height: normal;
	}

	.initiatecount .iconfont {
		color: #3281FF;
		font-size: 60rpx;
		font-weight: normal;
	}

	.administrative {
		align-content: center;
		background-color: #fff;
		margin-top: 20upx;
		padding-left: 20upx;
	}

	.titletext {
		font-size: 32upx;
		height: 100upx;
	}

	.uni-grid-9 {
		border-top: 0 !important;
	}

	.uni-grid {
		display: flex;
		flex: 1;
		flex-direction: column;
		overflow: hidden;
		height: 100%;
		margin-top: 20upx;
	}

	.mark {
		text-align: center;
		font-size: 24upx;
		vertical-align: hiddle;
	}

	.margin-top-267 {
		margin-top: 267upx;
	}
</style>